<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html lang="zh-cmn">
<head>
    <title>角色</title>
    <%@include file="/WEB-INF/pages/header.jsp"%>
    <style>
        #roleTable tr th{
            text-align: center;
        }
        #roleTable>tbody>tr:nth-child(2n-1){
            background-color:#eee;
        }
        #tempTable{
            text-align:center;
            border:1px solid #ddd;
        }
        #tempTable tr{
            height:25px;
        }
        #tempTable tr td{
            border:1px solid #ddd;
        }
        #tempTable tbody tr:nth-child(2n-1){
            background-color:#9de0f6;
        }
    </style>
</head>
<body>
<div class="container">
    <div id="toolbar">
        <a onclick="grant()" class="btn btn-danger"><i class="glyphicon glyphicon-grain"></i>&nbsp;角色授权</a>
        <a onclick="prepareAdd()" class="btn btn-success"><i class="glyphicon glyphicon-plus-sign"></i>&nbsp;添加角色</a>
    </div>
    <table data-toggle="table" id="roleTable"
           data-striped="true" data-url="${ctx}/sys/role/searchRole" data-toolbar="#toolbar"
           data-toolbar-align="right" class="text-center"
           data-detail-view="true"
           data-detail-formatter="getDetail">
        <thead>
        <tr >
            <th data-radio="true"></th>
            <th data-field="roleId">编号</th>
            <th data-field="roleLabel">角色名称(中文)</th>
            <th data-field="roleName">角色名称(英文)</th>
            <th data-field="createTime">创建时间</th>
            <th data-field="state" data-formatter="formatState">状态</th>
            <th data-formatter="formatOption" data-events="optEvents">操作</th>
        </tr>
        </thead>
    </table>
</div>

<%--授权列表存放--%>
<div id="grant">
    <div id="tree">
    </div>
</div>


<div id="add">
    <form id="add_form" class="form-horizontal">
        <div class="form-group">
            <label class="col-md-3 control-label">角色姓名(英文):</label>
            <div class="col-md-7">
                <input type="text" class="form-control" name="roleName">
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-3 control-label">角色姓名(中文):</label>
            <div class="col-md-7">
                <input type="text" class="form-control" name="roleLabel">
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-3 control-label">状态:</label>
            <div class="col-md-7">
                <label for="state1" class="radio-inline">
                    <input type="radio" id="state1" checked="checked" name="state" value="1">启用
                </label>
                <label for="state0" class="radio-inline">
                    <input type="radio" id="state0" name="state" value="0">禁用
                </label>
            </div>
        </div>
    </form>
</div>


<div id="update">
    <form id="update_form" class="form-horizontal">
        <input type="hidden" name="roleId"/>
        <div class="form-group">
            <label class="col-md-3 control-label">角色姓名(英文):</label>
            <div class="col-md-7">
                <input type="text" class="form-control" name="roleName">
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-3 control-label">角色姓名(中文):</label>
            <div class="col-md-7">
                <input type="text" class="form-control" name="roleLabel">
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-3 control-label">创建时间:</label>
            <div class="col-md-7">
                <input type="text" id="createTime" readonly="readonly"  class="form-control">
            </div>
        </div>
        <div class="form-group">
            <label class="col-md-3 control-label">状态:</label>
            <div class="col-md-7">
                <label for="state2" class="radio-inline">
                    <input type="radio" id="state2" checked="checked" name="state" value="1">启用
                </label>
                <label for="state3" class="radio-inline">
                    <input type="radio" id="state3" name="state" value="0">禁用
                </label>
            </div>
        </div>
    </form>
</div>

<%@include file="/WEB-INF/pages/footer.jsp"%>
<script src="${ctx}/res/js/role.js"></script>
</body>
</html>
